<template>
  <div class="rightBodyContent">
    <div class="rightBodyContent-in">
      <tips optionTemplate="reportDetail"></tips>
      <el-tabs v-model="activeName" type="card">
        <el-tab-pane :label="item.name" :name="item.id" v-for="item in tabList" :key="item.id"></el-tab-pane>
      </el-tabs>
      <!--      群组报告-->
      <groupTable v-if="activeName=='1'"></groupTable>
      <!--      互动工作-->
      <interactionTable v-if="activeName=='2'"></interactionTable>
      <!--      例行工作-->
      <routineTable v-if="activeName=='3'"></routineTable>
    </div>
  </div>
</template>

<script>
import {mapGetters} from "vuex";
import groupTable from './components/dataTable/group'
import interactionTable from './components/dataTable/interaction'
import routineTable from './components/dataTable/routine'
import {groupIndex} from "@/api/admin/group"

export default {
  components: {
    groupTable,
    interactionTable,
    routineTable
  },
  computed: {
    ...mapGetters(['userInfo']),
  },
  watch: {},
  data() {
    return {
      activeName: '1',
      tabList: [
        {
          name: '群组报告',
          id: '1',
        },
        {
          name: '互动工作',
          id: '2'
        },
        {
          name: '例行工作',
          id: '3'
        }
      ]
    }
  },
  created() {
  },
  methods: {
  },
  mounted() {
  }
}
</script>

<style lang="scss" scoped>
.evaluateBox {
  background: #eee;
  margin-top: 5px;
  border-radius: 4px;
  padding: 5px;
}

.lookLsit {
  cursor: pointer;
}

.lookLsit:hover {
  text-decoration: underline;
}

#tablebox {
  display: flex;
  flex-direction: column;
}

.el-table {
  color: #000;
}

.right-box .container .main .content-container .input-val-box .input-top {
  width: 250px;
}
</style>
